<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			.bigDiv{
				width: 980px;
				height: 530px;
				margin: 0 auto;
				background-image: url(images/reg_bg.gif);
				background-repeat: no-repeat;
				padding-top: 60px;
			}
			.divLeft{
				width: 630px;
				float: left;
				height: 470px;
			}
			.divRight{
				float: left;
				width: 350px;
				height: 470px;
			}
			.dataTable tr td:first-child{
				text-align: right;
			}
			.head{
				width: 1000px;
				height: 150px;
				margin: 0 auto;
			}
			.bottom{
				width: 1000px;
				height: 170px;
				margin: 0 auto;
			}
		</style>
		<script src="js/jquery.js"></script>
		<script>
			$(function(){
				$("#month").on("change",MonthChange);
				LoadMonth();
				$(".btn").mouseover(function(){
					var img=$(this).css("background-image").replace("gif","jpg");
					$(this).css("background-image",img);
				}).mouseout(function(){
					var img=$(this).css("background-image").replace("jpg","gif");
					$(this).css("background-image",img);
				});
				$("#uploadId").change(function() {
				    var $file = $(this);
				    var objUrl = $file[0].files[0];
					if(objUrl==undefined){
						alert("请选择一个图片");
						$("#imageview").css("display","none");
					}else{
						//获得一个http格式的url路径:mozilla(firefox)||webkit or chrome  
						var windowURL = window.URL || window.webkitURL;
						//createObjectURL创建一个指向该参数对象(图片)的URL  
						var dataURL = windowURL.createObjectURL(objUrl);
						$("#imageview").attr("src", dataURL).css("display","block");
					}
				});
				$(":button").click(submitDefault);
				$(".idNumber").blur(function(){
					var sp = $(this).next();
					if(VerifiId($(this).val())){
						sp.text("√").css("color","black");
					}else{
						sp.text("请输入正确的身份证号").css("color","red");
					}
				});
				$("input[name='year']").change(function(){
					$("#month").val("-1");
				});
			})
			function LoadMonth(){
				for(var i=0;i<12;i++){
					var opObj = $("<option></option>");
					opObj.val(i+1+"").text(i+1+"").appendTo($("#month"));
				}
			}
			function MonthChange(){
				var mon = $(this).val();
				var day=0;
				switch (mon){
					case "1":
					case "3":
					case "5":
					case "7":
					case "8":
					case "10":
					case "12":
						day = 31;
						break;
					case "2":
						if(IsLeap()){
							day = 29;
						}else{
							day = 28;
						}
						break;
					default:
						day = 30
						break;
				}
				$("#day").empty().append($("<option>[选择日期]</option>"));
				
				for (var i=1;i<=day;i++) {
					$("<option></option>").val(i+"").text(i+"").appendTo($("#day"));
				}
			}
			function IsLeap(){
				var year = parseInt($("input[name='year']").val());
				if((year % 4 == 0 && year % 100 != 0) || year % 400 == 0){
					return true;
				}else{
					return false;
				}
			}
			function ImageChange(){
				
				var path = $(this).val();
				if(path.length<=0){
					alert("请选择文件");
					$("#imgShowHead").css("display","none");
				}else{
					alert(path);
					$("#imgShowHead").css("display","block").attr("src",path);
					
				}
			}
			function submitDefault(e){
				window.location = "RegisterSuccess.html";
			}
			function VerifiId(id){
				var a = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);
				var b = "10x98765432";
				var num17 = id.substring(0, 17);
				var num18 = id.substr(-1);
				var total = 0;
				for (var i = 0; i < 17; i++)
					total += parseInt(num17[i]) * a[i];
				var mod = total % 11;
				var re = b[mod];
				if (num18.toLowerCase() == re)
					return true;
				else
					return false;
			}
		</script>
	</head>
	<body>
		<div class="head">
			<iframe name="head" src="Header.html" width="100%" height="100%" frameborder="0" scrolling="no"></iframe>
		</div>
		<div class="bigDiv">
			<div class="divLeft">
				<table style="width: 100%; height: 100%;" class="dataTable">
					<form enctype="multipart/form-data" method="post" action="RegisterSuccess.html">
						<tr>
							<td>名字：</td>
							<td>
								<input type="text" name="txtName" />
							</td>
						</tr>
						<tr>
							<td>姓氏：</td>
							<td>
								<input type="text" name="txtSurname" />（可包含a-z、0-9和下划线）
							</td>
						</tr>
						<tr>
							<td>登录名：</td>
							<td>
								<input type="text" name="txtLoginName" />
							</td>
						</tr>
						<tr>
							<td>密码：</td>
							<td>
								<input type="text" name="txtPwd" />（至少包含6个字符）
							</td>
						</tr>
						<tr>
							<td>再次输入密码：</td>
							<td>
								<input type="text" name="txtPwdAgain" />
							</td>
						</tr>
						<tr>
							<td>电子邮箱：</td>
							<td>
								<input type="text" name="txtEmail" />（必须包含@字符）
							</td>
						</tr>
						<tr>
							<td>性别：</td>
							<td>
								<input type="radio" name="sex" value="1" checked="checked" id="male" />
								<label for="male"><img src="images/Male.gif" />男</label>
								<input type="radio" name="sex" value="2" id="female" />
								<label for="female"><img src="images/Female.gif" />女</label>
							</td>
						</tr>
						<tr>
							<td>头像：</td>
							<td>
								<input type="file" id="uploadId" name="sourceFile" />
								<img id="imageview" width="150px" height="150px" style="display: none;" />
							</td>
						</tr>
						<tr>
							<td>爱好：</td>
							<td>
								<input type="checkbox" name="hoppy" value="1" id="sport" /><label for="sport">运动</label>
								<input type="checkbox" name="hoppy" value="2" id="talk" /><label for="talk">聊天</label>
								<input type="checkbox" name="hoppy" value="3" id="game" /><label for="game">玩游戏</label>
							</td>
						</tr>
						<tr>
							<td>出生日期：</td>
							<td>
								<input type="text" name="year" style="width: 40px;" />年
								<select name="month" id="month">
									<option value="-1">[选择月份]</option>
								</select>月
								<select name="day" id="day">
									<option>[选择日期]</option>
								</select>日
							</td>
						</tr>
						<tr>
							<td>身份证号：</td>
							<td>
								<input type="text" class="idNumber" /><span></span>
							</td>
						</tr>
						<tr>
							<td></td>
							<td>
								<input type="button" style="background-image: url(images/submit.gif); width: 80px;height: 34px;" value="" class="btn" />
								<input type="reset" style="background-image: url(images/reset.gif); width: 80px;height: 34px;" value="" class="btn" />
							</td>
						</tr>
					</form>
				</table>
			</div>
			<div class="divRight">
				<img src="images/read.gif" /><b>阅读贵美网服务协议</b><br />
				<textarea rows="20" cols="39" style="font-size: 15px;">贵美服务协议
【首部及导言】
欢迎您使用贵美的服务！
  为使用贵美的服务，您应当阅读并遵守《贵美服务协议》（以下简称“本协议”）和《贵美隐私政策》。请您务必审慎阅读、充分理解各条款内容，特别是免除或者限制贵美责任的条款、对用户权利进行限制的条款、约定争议解决方式和司法管辖的条款（如第十八条相关约定）等，以及开通或使用某项服务的单独协议或规则。限制、免责条款或者其他涉及您重大权益的条款可能以加粗、加下划线等形式提示您重点注意。
  除非您已充分阅读、完全理解并接受本协议所有条款，否则您无权使用贵美服务。您点击“同意”或“下一步”，或您使用贵美服务，或者以其他任何明示或者默示方式表示接受本协议的，均视为您已阅读并同意签署本协议。本协议即在您与贵美之间产生法律效力，成为对双方均具有约束力的法律文件。
  如果您因年龄、智力等因素而不具有完全民事行为能力，请在法定监护人（以下简称"监护人"）的陪同下阅读和判断是否同意本协议，并特别注意未成年人使用条款。
  如果您是中国大陆地区以外的用户，您订立或履行本协议还需要同时遵守您所属和/或所处国家或地区的法律。 
				</textarea>
			</div>
		</div>
		<div class="bottom">
			<iframe src="BottomBar.html" width="100%" height="100%" frameborder="0" scrolling="no"></iframe>
		</div>
		<script src="js/search.js"></script>
	</body>
</html>
